<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>地震局培训平台</title>
		<link rel="stylesheet" href="style/main.css" />
		<link rel="stylesheet" href="style/apply.css" />
	</head>

	<body>
		<div id="info">
			<div class="info">
				<div class="newsbox">
					<!--消息滚动-->
					<div class="news nowrap">消息：欢迎加入地震应急志愿者培训平台，您是第123456位访问用户。</div>
				</div>
				<div class="infobox">
					<div class="name nowrap">zhangming</div>
					<div class="info_id nowrap">N.8784547</div>
					<div class="sign_out">退出</div>
				</div>
				<div class="leave_m">互动留言</div>
			</div>
		</div>
		<div id="show">
			<nav id="nav">
				<div class="top">
					<div class="logo"></div>
					<div class="seachbox">
						<input type="text" id="search" value="在线课堂搜索" />
						<div class="weibo codeIcon">
							<div class="first">
								<img src="image/weiboCode.png" />
							</div>
						</div>
						<div class="weixin codeIcon">
							<div class="first">
								<img src="image/weixinCode.png" />
							</div>
						</div>
					</div>
				</div>
				<div class="border">
					<ul class="nav">
						<li class="in" data-url="index">首页</li>
						<li data-url="news">新闻资讯</li>
						<!--<li data-url="story">志愿故事</li>-->
						<li class="team">志愿品牌
							<div class="first">
								<div data-url="story">志愿故事</div>
								<div data-url="team">志愿团体</div>
								<div data-url="star">志愿之星</div>
							</div>
						</li>
						<!--<li data-url="project">志愿项目</li>
						<li data-url="star">志愿之星</li>-->
						<li data-url="train">培训平台</li>
						<li data-url="policy">志愿政策</li>
					</ul>
				</div>
			</nav>
			<div id="content">
				<div class="content">
					<div class="border"></div>
					<!--<div class="list">
						<div class="title">账户信息</div>
						<div class="box">
							<div class="text1">用户名：</div>
							<input type="text" class="text2" />
						</div>
						<div class="box">
							<div class="text1">密码：</div>
							<input type="text" class="text2" />
						</div>
						<div class="box">
							<div class="text1">确认密码：</div>
							<input type="text" class="text2" />
						</div>
						<div class="box">
							<div class="text1">电子邮箱：</div>
							<input type="text" class="text2" />
						</div>
					</div>-->
					<div class="list">
						<div class="title">个人基本信息</div>
						<div class="box">
							<div class="text1">国家/地区：</div>
							<input type="text" class="text2" />
						</div>
						<div class="box">
							<div class="text1">真实姓名：</div>
							<input type="text" class="text2" />
						</div>
						<div class="box">
							<div class="text1">证件类型：</div>
							<input type="text" class="text2" />
						</div>
						<div class="box">
							<div class="text1">证件号码：</div>
							<input type="text" class="text2" />
						</div>
						<div class="box">
							<div class="text1">性别：</div>
							<div class="radiobox">
								<div class="radio in">男</div>
								<div class="radio">女</div>
							</div>
						</div>
						<div class="box">
							<div class="text1">出生日期：</div>
							<div class="select sort">
								<div class="select-text">1990</div>
								<span class="icon-sort-down in"></span>
								<ul class="select-ul">
									<li>1990</li>
									<li>1991</li>
									<li>1992</li>
									<li>1993</li>
									<li>1994</li>
									<li>1995</li>
									<li>1996</li>
									<li>1997</li>
									<li>1998</li>
									<li>1999</li>
								</ul>
							</div>
							<div class="select sort">
								<div class="select-text">01</div>
								<span class="icon-sort-down in"></span>
								<ul class="select-ul">
									<li>01</li>
									<li>02</li>
									<li>03</li>
									<li>04</li>
									<li>05</li>
									<li>06</li>
									<li>07</li>
									<li>08</li>
									<li>09</li>
									<li>10</li>
									<li>11</li>
									<li>12</li>
								</ul>
							</div>
							<div class="select sort">
								<div class="select-text">01</div>
								<span class="icon-sort-down in"></span>
								<ul class="select-ul">
									<li>01</li>
									<li>02</li>
									<li>03</li>
									<li>04</li>
									<li>05</li>
									<li>06</li>
									<li>07</li>
									<li>08</li>
									<li>09</li>
									<li>10</li>
									<li>11</li>
									<li>12</li>
								</ul>
							</div>
						</div>
						<div class="box">
							<div class="text1">整治面貌：</div>
							<div class="select" id="zhengzhi">
								<div class="select-text"></div>
								<span class="icon-sort-down in"></span>
								<ul class="select-ul">
									<li>中国共产党党员</li>
									<li>中国共产党预备党员</li>
									<li>中国共产党党员（保留团籍）</li>
									<li>中国共产主义青年团团员</li>
									<li>中国国民党革命委员会会员</li>
									<li>中国民主同盟盟员</li>
									<li>中国民主建国会会员</li>
									<li>中国民主促进会会员</li>
									<li>中国农工民主党党员</li>
									<li>中国致公党党员</li>
									<li>九三学社社员</li>
									<li>台湾民主自治同盟盟员</li>
									<li>无党派民主人士</li>
									<li>中国少年先锋队队员</li>
									<li>群众</li>
								</ul>
							</div>
						</div>
						<div class="box">
							<div class="text1">民族：</div>
							<div class="select" id="minzu">
								<div class="select-text"></div>
								<span class="icon-sort-down in"></span>
								<ul class="select-ul">
									<!--<li>汉族</li>
									<li>少数民族</li>-->
								</ul>
							</div>
						</div>
						<div class="box">
							<div class="text1">籍贯：</div>
							<div class="select">
								<div class="select-text">北京市</div>
								<span class="icon-sort-down in"></span>
								<ul class="select-ul">
									<li>北京市</li>
									<li>河北省</li>
								</ul>
							</div>
						</div>
						<div class="box">
							<div class="text1">手机号：</div>
							<input type="text" class="text2" />
						</div>
						<div class="box">
							<div class="text1">固定电话：</div>
							<input type="text" class="text2" />
						</div>
						<div class="box">
							<div class="text1">居住区域：</div>
							<div class="select">
								<div class="select-text">东城区</div>
								<span class="icon-sort-down in"></span>
								<ul class="select-ul">
									<li>东城区</li>
									<li>西城区</li>
								</ul>
							</div>
						</div>
						<div class="box">
							<div class="text1">详细地址：</div>
							<input type="text" class="text2 long" />
						</div>
						<div class="box">
							<div class="text1">最高学历：</div>
							<div class="select" id="xueli">
								<div class="select-text"></div>
								<span class="icon-sort-down in"></span>
								<ul class="select-ul">
									<li>博士生研究生</li>
									<li>硕士研究生</li>
									<li>大学本科</li>
									<li>大学专科</li>
									<li>中等专科</li>
									<li>职业高中</li>
									<li>技工学校</li>
									<li>高中</li>
									<li>初中</li>
									<li>小学</li>
									<li>其他</li>
								</ul>
							</div>
						</div>
						<div class="box">
							<div class="text1">从业状况：</div>
							<div class="select long">
								<div class="select-text"></div>
								<span class="icon-sort-down in"></span>
								<ul class="select-ul">
									<li>国家公务员（含参照、依照公务员管理）</li>
									<li>专业技术人员</li>
									<li>职员</li>
									<li>企业管理人员</li>
									<li>工人</li>
									<li>农民</li>
									<li>学生</li>
									<li>教师</li>
									<li>现役军人</li>
									<li>自由职业者</li>
									<li>个体经营者</li>
									<li>无业人员</li>
									<li>退（离）休人员</li>
									<li>其他</li>
								</ul>
							</div>
						</div>
						<div class="box">
							<div class="text1">受邀加入志愿者项目：</div>
							<div class="radiobox">
								<div class="radio in">是</div>
								<div class="radio">否</div>
							</div>
						</div>
						<div class="box">
							<div class="text1">服务区域：</div>
							<div class="select">
								<div class="select-text">请选择</div>
								<span class="icon-sort-down in"></span>
								<ul class="select-ul">
									<li>是</li>
									<li>否</li>
								</ul>
							</div>
						</div>
						<div class="box">
							<div class="text1">服务类型：</div>
							<div class="radiobox">
								<div class="radio in">赛会服务</div>
								<div class="radio">应急救援</div>
								<div class="radio">城市运行</div>
								<div class="radio">文化教育</div>
								<div class="radio">关爱服务</div>
								<div class="radio">社区服务</div>
								<div class="radio">绿色环保</div>
								<div class="radio">医疗卫生</div>
								<div class="radio">在线志愿服务</div>
								<div class="radio">京外服务</div>
								<div class="radio">国际服务</div>
								<div class="radio">其他</div>
							</div>
						</div>
					</div>
					<div class="list">
						<div class="title">服务领域或行业</div>
						<div class="box box2">
							<div class="radiobox">
								<div class="radio in">社区志愿者</div>
								<div class="radio">青年志愿者</div>
								<div class="radio">文明志愿者</div>
								<div class="radio">文化志愿者</div>
								<div class="radio">医疗志愿者</div>
								<div class="radio">教育志愿者</div>
								<div class="radio">助残志愿者</div>
								<div class="radio">巾帼志愿者</div>
								<div class="radio">消防志愿者</div>
							</div>
						</div>
						<div class="box box2 box3">
							<div class="radiobox">
								<div class="radio in">
									<div>治安志愿者</div>
									<div class="text3">首都综治办发起，主要开展治安巡逻的志愿者</div>
								</div>
								<div class="radio">
									<div>网络文明引导志愿者</div>
									<div class="text3">由首都文明办发起。开展网络文明引导的志愿者</div>
								</div>
								<div class="radio">
									<div>劝导队志愿者</div>
									<div class="text3">由社工委发起，在社区里开展文明劝导的志愿者</div>
								</div>
								<div class="radio">
									<div>博物馆志愿者</div>
									<div class="text3">由市应急办发起，开展应急宣教和救援的志愿者</div>
								</div>
								<div class="radio">
									<div>红十字志愿者</div>
									<div class="text3">由市红十字会发起，开展红十字志愿服务的志愿者</div>
								</div>
								<div class="radio">
									<div>旅游志愿者</div>
									<div class="text3">由市旅游委发起，在各旅游景点开展服务的志愿者</div>
								</div>
								<div class="radio">
									<div>博物馆志愿者</div>
									<div class="text3">由市文物局发起，在各博物馆开展义务讲解的志愿者</div>
								</div>
								<div class="radio">
									<div>保护知识产权志愿者 </div>
									<div class="text3">由市知识产权局发起，开展保护知识产权宣教的志愿者</div>
								</div>
								<div class="radio">
									<div>节水护水志愿者</div>
									<div class="text3">由市水务局发起。以保护水资源为主的志愿者</div>
								</div>
								<div class="radio">
									<div>科普志愿者</div>
									<div class="text3">由市科协发起，主要开展科普宣教的志愿者</div>
								</div>
							</div>
						</div>
					</div>
					<div class="list">
						<div class="title">志愿者誓词</div>
						<div class="box4">
							<div class="text4">我是北京志愿者，为使我们的国家和城市更美好、人民更幸福、环境更安全，我要团结身边的人，投身其间。面对需求，我要行动。我承诺，我将竭尽所能，参加公益活动，帮助困难人群，真诚关怀有需要的人士，为他们带来温暖。</div>
							<div class="agreebtn"></div>
							<div class="radio agreeR"><span class="agreetext">同意志愿者协议</span></div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div id="bottom">
			<ul class="border">
				<li>相关协作单位：</li>
				<li>中国红十字会</li>
				<li>中科院心理所</li>
				<li>中国地震信息网</li>
				<li>中国地震科普网</li>
				<li>北京市地震局科普网 </li>
				<li>科普网</li>
			</ul>
			<div class="bottom">
				<ul class="one">
					<li>设为首页</li>
					<li>交换链接</li>
					<li>关于我们</li>
					<li>联系我们</li>
					<li>常见问题</li>
					<li>心理教室</li>
					<li>党团建设</li>
				</ul>
				<ul class="two">
					<li>主办：北京市地震局</li>
					<li>版权所有 京ICP备08988239</li>
					<li>技术支持：中宣助力传媒</li>
				</ul>
			</div>
		</div>
			<div id="bombbox">
				<div class="bombbox">
					<h3>志愿者协议</h3>
					<p class="text">本网站及与本网站链接的网站，仅提供志愿者、志愿服务团体、志愿服务机构及其它与此相关联之志愿服务项目。</p>
					<p class="text">志愿者、志愿服务团体、志愿服务机构以及因 其它任何目的进入本网站的访问者接受本协议书条款，注册成为志愿北京网站会员，并遵守本协议所述之条款使用本网站所提供之服务。如果您不接受本声明之条款，请勿使用本网站。接受本声明之条款，您将遵守本协议之规定</p>
					<p class="text2">1.信息的发布</p>
					<p class="text">不得发布任何违反有关法律规定信息；</p>
					<p class="text">不得发布任何与本网站志愿服务目的不适之信息；</p>
					<p class="text">不得发布任何不完整、虚假的信息；</p>
					<p class="text">用户对所发布的信息承担完全责任。</p>
					<p class="text2">2.信息的使用</p>
					<p class="text">志愿服务团体、志愿服务机构仅可就志愿服务目的使用志愿者之个人信息；</p>
					<p class="text">志愿者仅可因参加某志愿服务项目，使用志愿服务团体、志愿服务机构发布之项目招募信息；</p>
					<p class="text">本网站提供的其它信息，仅与其相应内容有关的目的而被使用；</p>
					<p class="text">不得将任何本网站的信息用作任何商业目的。</p>
					<p class="text2">3.信息的公开</p>
					<p class="text">在本网站所登录的任何信息，均有可能被任何本网站的访问者浏览，也可能被错误使用。本网站对此将不予承担任何责任。</p>
					<p class="text2">4.信息的准确性</p>
					<p class="text">任何在本网站发布的信息，均必须符合合法、准确、及时、完整的原则。</p>
					<p class="text">但本网站将不能保证所有由第三方提供的信息，或本网站自行采集的信息完全准确。</p>
					<p class="text">使用 者了解，对这些信息的使用，需要经过进一步核实。本网站对访问者未经自行核实误用本网站信息造成的任何损失不予承担任何责任。</p>
					<p class="text">5.信息更改与删除</p>
					<p class="text">除了信息的发布者外，任何访问者不得更改或删除他人发布的任何信息。本网站有权根据其判断保留修改或删除任何不适信息之权利。</p>
					<p class="text">6.版权、商标权</p>
					<p class="text">本网站的图形、图像、文字及其程序等均属本网站之版权，受商标法及相关知识产权法律保护，未经志愿本网站书面许可，任何人不得下载、复制、再使用。在本网发布信息之商标，归其相应的商标所有权人，受商标法保护。</p>
					<p class="text">7、注册信息使用</p>
					<p class="text">注册会员所提供的个人信息将会被本网站统计、汇总，在我们的严格管理下，为本网站的合作者提供依据。</p>
					<p class="text">本网站会不定期地通过注册会员留下的电子邮件、电话或通信地址同该会员保持联系。</p>
					<p class="text">本网站承诺：在未经访问者授权同意的情况下，本网站不会将访问者的个人资料泄露给第三方。但以下情况除外。</p>
					<p class="text">·根据执法单位之要求或为公共之目的向相关单位提供个人资料；</p>
					<p class="text">·由于您将用户密码告知他人或与他人共享注册帐户，由此导致的任何个人资料泄露；</p>
					<p class="text">·由于计算机2000年问题、黑客攻击、计算机病毒侵入或发作、因政府管制而造成的暂时性关闭等影响网络正常经营之不可抗力而造成的个人资料泄露、丢失、被盗用或被窜改等；</p>
					<p class="text">·由于与本网站链接的其它网站所造成之个人资料泄露及由此而导致的任何法律争议和后果；</p>
					<p class="text">·为免除访问者在生命、身体或财产方面之急迫危险。</p>
					<p class="text2">8.自责</p>
					<p class="text">所有使用本网站的用户，对使用本网站信息和在本网站发布信息的被使用，承担完全责任。本网站对任何因使用本网站而产生的第三方之间的纠纷，不负任何责任。</p>
					<p class="text2">9.服务终止</p>
					<p class="text">本网站有权在预先通知或不予通知的情况下终止任何免费服务。</p>
					<p class="text">10.争议处理</p>
					<p class="text">本网站因正常的系统维护、系统升级，或者因网络拥塞而导致网站不能访问，本网站不承担任何责任。</p>
					<p class="text2">11.免责条款</p>
					<p class="text">本网并无随时监视此网址，但保留对其实施实时监视的权利。对于他方输入的，不是本网发布的材料，本网概不负任何法律责任。</p>
					<p class="text">对于其他网址链接在本网址的内容，本网概不负法律责任。</p>
					<div class="closebtn">关闭</div>
				</div>
			</div>
			<script type="text/javascript" src="script/jquery.min.js"></script>
			<script type="text/javascript" src="script/ishoock.tools.js"></script>
			<script type="text/javascript" src="script/main.js"></script>
			<script>
				$(function() {
					getMinzuList();//获取民族列表
					$(".radio").on("click", function() {
						if($(this).hasClass("agreeR")) {
							if($(event.target).hasClass("agreetext")){
								$("#bombbox").show();
							}else{
								if($(this).hasClass("in")) {
								$(this).removeIn();
							} else {
								$(this).in();
							}
							}
							
						} else {
							$(this).parent(".radiobox").children().removeIn();
							$(this).in();
						}

					});
					
					//点击弹框的关闭按钮
					$("#bombbox .closebtn").on("click",function(){
						$("#bombbox").hide();
					})
					
					

				})
				
				var minzuArr=["汉族",'蒙古族','回族','藏族','维吾尔族','苗族','彝族','壮族','布依族','朝鲜族','满族','侗族','瑶族','白族','土家族','哈尼族','哈萨克族','傣族','黎族','僳僳族','佤族','畲族','高山族','拉祜族','水族','东乡族','纳西族','景颇族','柯尔克孜族','土族','达斡尔族','仫佬族','羌族','布朗族','撒拉族','毛南族','仡佬族','锡伯族','阿昌族','普米族','塔吉克族','怒族','乌孜别克族','俄罗斯族','鄂温克族','德昂族','保安族','裕固族','京族','塔塔尔族','独龙族','鄂伦春族','赫哲族','门巴族','珞巴族','基诺族','外籍血统中国人士'];
				function getMinzuList(){
					for(var i=0;i<minzuArr.length;i++){
						var item='<li>'+minzuArr[i]+'</li>';
						$("#minzu .select-ul").append(item);
					}
				}
			</script>
	</body>

</html>